<template>
  <div>
    <ul class="approvalRecord">
      <li class="colspan">
        <div class="content">
          <p v-for="(item,index) in recordList" v-show="index === 0" :key="index" class="tit">
            {{ $t('{0} 于 {1}启动流程', [item.startUser,item.startDate]) }}
          </p>
        </div>
      </li>
      <li v-for="(item,index) in recordList" v-show="index>0" :key="index">
        <template v-if="item.submitType === 'stop'">
          <span style="font-size: 13px;line-height: 20px;padding: 10px;">
            {{ $t('{0} 于 {1}终止流程', [item.stopUser,item.stopDate]) }}
            <br>
            {{ $t('终止原因') }}：{{ item.stopReason }}
          </span>
        </template>
        <template v-else>
          <div class="user center"><i v-html="item.taskName" /></div>
          <div class="user center" style="padding:10px;">
            <i v-for="(approver) in item.approver" :key="approver">
              {{ approver }}
            </i>
          </div>
          <div class="content">
            <p v-if="item.submitType === 'adjustNode'" class="tit contentTit">{{ $t('{0} 将流程调整至 {1}', [item.adjustNodeUser,item.adjustNode]) }}</p>
            <p v-for="(comment,inex) in item.commentList" v-else :key="inex" class="tit contentTit" style="white-space:pre-wrap">{{ comment.message }}</p>
            <p v-if="item.ccUser !== '' && item.ccUser !== null" class="tit contentTit">{{ $t('抄送用户') }}:{{ item.ccUser }}</p>
            <p class="test">
              <span v-for="att of item.taskAttachments" :key="att.id">
                <a class="link_a" :title="$t('点击预览，右键下载')" @click="onlinePreview(att)" @contextmenu.prevent="down(att)">{{ att.name }}</a>
              </span>
            </p>
            <p class="test">
              <span v-if="item.startTime">
                <i class="startTime" />
                {{ parseTime(item.startTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              <i v-if="item.endTime">-</i>
              <span v-if="item.endTime">
                <i class="endTime" />
                {{ parseTime(item.endTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
            </p>
          </div>
        </template>
      </li>

    </ul>

    <!-- 预览附件 -->
    <OnlinePreview ref="OnlinePreview" :preview-tit="previewTit" />
  </div>
</template>

<script>
import { approvalRecord, showNodeAssignees } from '@/api/act/process/actProcess'
  import { downLoadFileOpen } from '@/utils/zipdownload'
  export default {
    name: 'ActModelFlowDetails',
    data() {
      return {
        recordList: [],
        previewTit: undefined,
        taskName: []
      }
    },
    created() {
    },
    mounted() {
    },
    methods: {
      getList(queryData) {
        console.log('queryData', queryData)
        // 查询历史节点的待办审批的信息
        if (queryData.history !== undefined && queryData.history === 'history') {
          approvalRecord(queryData).then(response => {
            this.recordList = response.data
            this.formatApproval(this.recordList)
          })
        } else {
          // 根据流程实例ID和节点aid获取没有审批过的节点数据（节点名称已经对应的审批人）
          showNodeAssignees(queryData.actId, queryData.sid).then(response => {
            this.recordList = response.data
            this.formatApproval(this.recordList)
          })
        }
      },
      // 预览附件
      onlinePreview(row) {
        this.$refs.OnlinePreview.onlinePreviewFile(row.id)
      },
      down(row) {
        downLoadFileOpen(row.id)
      },
      formatApproval(recordList) {
        for (let i = 0; i < recordList.length; i++) {
          var commentList = recordList[i].commentList
          if (commentList != null) {
            for (let j = 0; j < commentList.length; j++) {
              if (commentList[j].message.indexOf('\n') !== -1) {
                commentList[j].message = commentList[j].message.replace('审批意见:', '审批意见:\n')
              }
            }
          }
        }
      }

    }
  }
</script>
<style lang="sass" scoped>

</style>
